<template>
	<view>
    <view class="fixbg"></view>
		<MusicHead title="登录中心" :isShow="true" textColor="#fff"></MusicHead>
		<view class="login-cont">
			<view class="username">
				<text class="text">手机号码 : </text>
				<input type="text" v-model="username" focus placeholder="请输入手机号码" />
			</view>
			<view class="pwd">
				<text class="text">登录密码 : </text>
				<input type="text" v-model="pwd" password placeholder="请输入登录密码" />
			</view>
      <button type="default"  class="loginBtn" @tap="login">登录</button>
		</view>
	</view>
</template>

<script>
	import MusicHead from "@/components/MusicHead/MusicHead.vue"
	import { baseURL } from "@/utils/request.js"
	export default {
		data() {
			return {
				username:'',
				pwd:''
			}
		},
		onLoad() {
			
		},
		methods: {
			// 点击登录按钮
			login(){  
       uni.request({
         // url: "/login/cellphone?phone="+ this.username +"&password=" + this.pwd,
         url: baseURL + "/login/cellphone",
         method:'GET',
         data:{
           phone: this.username,
           password: this.pwd
         },
         success:({data:res})=>{
           console.log(res)
           if(res.code !== 200) return
             // 存储用户信息
             uni.setStorageSync("userInfo",JSON.stringify(res.profile))
             // 存储 token
             uni.setStorageSync("token",res.token)
             uni.showToast({
              title:"登录成功",
              icon:"none"
             })
             // 登录成功后跳转至首页
             uni.navigateTo({
              url:"/pages/index/index"
             })
         }
       })
			}
		},
    components:{
			MusicHead
		}	
	}
</script>

<style scoped>
.fixbg{
  background-image: url(../../static/images/wy_logo.jpg);
  filter: blur(30px);
  /* background-size: contain; */
}
.login-cont{
	box-sizing: border-box;
	/* width: 100%; */
	height: 100%;
	margin: 200rpx 40rpx 0;
  color: #fff;
}
.username,
.pwd{
	display: flex;
	align-items: center;
	height: 80rpx;
}
.text{
	margin-right: 18rpx;
}
input{
	flex: 1;
	padding-left: 12rpx;
	border-bottom: 1px solid #fff;
}
.loginBtn{
  width: 100%;
  height: 92rpx;
  margin-top: 30rpx;
  background-color: rgba(255,0,0,.5);
  color: #fff;
  letter-spacing: 6rpx;
  /* font-size: 28rpx; */
  font-weight: bold;
  border-radius: 46rpx;
}
</style>
